<template>
	<el-main class="bg table_wrap subject">
	  <!-- table头部检索 -->
	  <div class="div-form">
		<el-form
		  ref="elFormRef"
		  :model="formInline"
		  label-width="90px"
		  :style="{ width: '100%' }"
		  label-position="left"
		>
		  <el-row :gutter="20">
			<el-col :span="5">
			  <el-form-item label="名称">
				<el-input v-model="formInline.name"></el-input>
			  </el-form-item>
			</el-col>
		  </el-row>
		</el-form>
	  </div>
	  <baseTable
		:tableColumns="columns"
		:requestApi="url_get_list"
		:isShowSelect="true"
		:imgflag="false"
		:vm="vm" 
		v-model:isRefresh="isRefresh"
		:otherParams="formInline"
		:isExportTableDataList="false"
		@handleTableDataList="handleTableDataList"
		@handleSelectionChange="handleSelectionChange"
		@handleCurrentChangeNew="handleCurrentChangeNew"
	  >
		<!-- 头部按钮 -->
		<template #baseHeadFunt>
		  <el-button type="primary" @click="onSubmit">查询</el-button>
		  <el-button @click="onReset(true)">重置</el-button>
		  <el-button
			type="danger"
			v-if="
			  user_group == '管理员' || $check_action('/exam/table', 'del')
			"
			class="search_btn_del"
			@click="delInfo()"
			>删除</el-button
		  >
		  <el-button
			v-if="user_group == '管理员' || $check_action('/exam/table', 'add')"
			class="float-right search_btn_add"
			@click="router.push('./view?')"
			>添加</el-button
		  >
		</template>
		<!-- table内操作 -->
		<template #baseTableFunt="{ scope }">
		  <el-button
		  v-if="user_group == '管理员' || $check_action('/exam/table','set')"
			type="primary"
			size="small"
			@click="router.push('./view?' + field + '=' + scope.row.exam_id)"
			>详情</el-button
		  >
		  <el-button
		  v-if="user_group == '管理员' || $check_action('/exam/table','setting')"
			type="primary"
			size="small"
			@click="router.push('./question_table/table?' + field + '=' + scope.row.exam_id)"
			>题库</el-button
		  >
		  <el-button class="e-button el-button--small is-plain el-button--primary"  :data-num='getObj(scope.row[field]).score_state' style="margin-left: 0;margin-top: 10px" v-if="(user_group == '管理员' || $check_exam('/exam/table','answers')) && getObj(scope.row[field]).score_state"
		  @click="router.push('/answer_view/view?' + field + '=' + scope.row[field])" size="small">
				<span>查看分数</span>
			</el-button>
			<el-button class="e-button el-button--small is-plain el-button--primary" style="margin-left: 0;margin-top: 10px" v-else-if="(user_group == '管理员' || $check_exam('/exam/table','answers')) && scope.row.status==='启用'"
			@click="router.push('/answer_view/view?' + field + '=' + scope.row[field])" size="small">
				<span>答题</span>
			</el-button>
			<el-button class="e-button el-button--small is-plain el-button--primary" style="margin-top: 10px" v-if="user_group == '管理员' || $check_exam('/exam/table','give_score')"
			@click="router.push('/score_table/table?' + field + '=' + scope.row[field])" size="small">
				<span>评分</span>
			</el-button>
		</template>
		<template #baseTableFunt2="{ scope }">
		  <el-button
		  v-if="user_group == '管理员' || $check_action('/exam/table','set')"
			type="primary"
			size="small"
			@click="router.push('./view?' + field + '=' + scope.exam_id)"
			>详情</el-button
		  >
		  <el-button
		  v-if="user_group == '管理员' || $check_action('/exam/table','setting')"
			type="primary"
			size="small"
			@click="router.push('./question_table?' + field + '=' + scope.exam_id+'&orderby=question_order')"
			>题库</el-button
		  >
		  <el-button class="e-button el-button--small is-plain el-button--primary"  :data-num='getObj(scope[field]).score_state'  v-if="(user_group == '管理员' || $check_exam('/exam/table','answers')) && getObj(scope[field]).score_state"
		  @click="router.push('./answer_view?' + field + '=' + scope[field])" size="small">
				<span>查看分数</span>
			</el-button>
			<el-button class="e-button el-button--small is-plain el-button--primary"  v-else-if="(user_group == '管理员' || $check_exam('/exam/table','answers')) && scope.status==='启用'"
			@click="router.push('./answer_view?' + field + '=' + scope[field])" size="small">
				<span>答题</span>
			</el-button>
			<el-button class="e-button el-button--small is-plain el-button--primary"  v-if="user_group == '管理员' || $check_exam('/exam/table','give_score')"
			@click="router.push('./score_table?' + field + '=' + scope[field])" size="small">
				<span>评分</span>
			</el-button>
		</template>
		<!-- 特殊表格内容 -->
		<template #tableContent="{ scope, column }">
			<span v-if="column.prop === 'create_time'">{{
          formatDate(scope.row.create_time)
        }}</span>
        <span v-if="column.prop === 'update_time'">{{
          formatDate(scope.row.update_time)
        }}</span>
		<template #tableContent2="{ scope, column }">
        <span v-if="column.prop === 'create_time'">{{ column.label }}：{{
          formatDate(scope.create_time)
        }}</span>
        <span v-if="column.prop === 'update_time'">{{ column.label }}：{{
          formatDate(scope.update_time)
        }}</span>
		</template>
	  </baseTable>
	</el-main>
  </template>
  <script setup>
  import { useRouter } from "vue-router";
  let router = useRouter();
  import {
	$check_exam,
	$fullUrl,
	formatDate,
	$banseUrl,
	$check_action,
  } from "@/utils/utils.js";
  import { $post, $get } from "@/api/Api.js";
  import { Picture } from "@element-plus/icons-vue";
  import { ElMessage } from "element-plus";
  import { ref, toRefs, computed, onMounted } from "vue";
  import storageHelper from "@/libs/StorageHelper";
  let table = ref("exam");
  let field = ref("exam_id");
  let url_get_list = ref("/api/exam/get_list");
  let url_del = ref("/api/exam/del?");
  let user_group = storageHelper.getUserInfo().user_group;
  let user_id = storageHelper.getUserInfo().user_id;
  let answered_list = ref([]);
  // 列名
  const columns = [
	{ prop: "name", label: "名称" },
	{ prop: "duration", label: "答题时长" },
	{ prop: "score", label: "总分" },
	{ prop: "status", label: "状态" },
	{ prop: "create_time", label: "创建时间" },
	{ prop: "update_time", label: "更新时间" },
  ];
  // 刷新table
  let isRefresh = ref(false);
  let vm=ref({
  id: "exam_id",
})
  //批量勾选数据
  let selectList = ref([]);
  //点击当前行数据
  let currentRowTableProduct = ref({});
  //表格勾选回调
  let handleSelectionChange = (val) => {
	selectList.value = val.map((item) => {
	  return item.exam_id;
	});
  };
    // 查询数组对象某个是否包含某个值,返回对应对象
let getObj = (val) => {
  let obj = answered_list.value.find((item) => item.exam_id == val);
  if (obj) {
    return obj;
  } else {
    return "-";
  }
};
  //点击当前行
  let handleCurrentChangeNew = (val) => {
	currentRowTableProduct.value = val;
  };
  // 批量删除
  let delInfo = () => {
	ElMessageBox.confirm("此操作将永久删除该文件, 是否继续?", "提示", {
	  confirmButtonText: "确定",
	  cancelButtonText: "取消",
	  type: "warning",
	})
	  .then(() => {
		selectList.value.map((item) => {
		  delFun(item);
		});
	  })
	  .catch(() => {
		ElMessage({
		  type: "info",
		  message: "取消操作",
		});
	  });
  };
  
  // 调用删除方法
  let delFun = (id) => {
	$get(url_del.value + "exam_id=" + id).then((json) => {
	  if (json.result) {
		ElMessage.success("删除成功");
	  } else if (json.error) {
		ElMessage.error(json.error);
	  }
	  isRefresh.value = true;
	});
  };
  
  let table_class = ({ row, column, rowIndex, columnIndex }) => {
	return "table_class";
  };
  // 头部搜索// 搜索
  let formInline = ref({
	name: "",
  });
  // 搜索
  let onSubmit = () => {
	isRefresh.value = true;
  };
  
  // 重置
  let onReset = (refresh) => {
	formInline.value = {
	  name: "",
	};
	isRefresh.value = refresh;
  };
  // table暴露出来的数据
  let list=ref([])
  let handleTableDataList = (data) => {
	answered_list.value=[]
	list.value = data;
	get_list_after()
  };
  
  let get_list_after=()=>{
		for (let i=0;i<list.value.length;i++){
			get_user_answer_state(list[i].value.exam_id);
		}
	}
  let get_user_answer_state = (exam_id) => {
	$get("/api/user_answer/get_obj?user_id="+user_id+"&exam_id="+exam_id).then((res)=>{
			if(res.result && res.result.obj != null){
				answered_list.value.push(res.result.obj)
				//_this.$set(_this.answered_list,exam_id,true)
			}else {
				// answered_list.value.push(res.result.obj)
				//_this.$set(_this.answered_list,exam_id,false)
			}
		})
  };
  onMounted(() => {});
  </script>
  <style lang="less" scoped>
  .div-form {
	padding: 10px;
  }
  </style>
  